<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <link rel="icon" href="img/favicon.ico">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="layui/css/layui.css">
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/vendor.min.css">
    <link rel="stylesheet" href="css/plugins.min.css">
    <link rel="stylesheet" href="css/style.min.css">
    <style>
        .pwde-table {
            width: 100%;
            text-align: center;
            border: solid 1px black;
        }
        .pwde-tr {
            background-color: #006fb7;
        }
        .pwde-table tr, td, th {
            height: 40px;
            border: solid 1px black;
        }
        html{
            height: 100%;
            overflow-y: hidden;
        }
        body{
            height: 100%;
            overflow-y: auto;
        }
        .aaa{
            padding:0 15px;height:35px;line-height:32px;font-size:14px;text-transform:uppercase
        }
    </style>
</head>
<body>

<div class="container" style="margin-top: 20px;">
    <div class="row">
        <div class="col-lg-6">
            <div class="single-product-img h-100">
                <div class="swiper-container single-product-slider">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide">
                            <a class="single-img gallery-popup" id="pic-bac">
                                <img class="img-full" src="" style="width: 540px;height: 380px;" id="pic-bac2">
                            </a>
                        </div>
                    </div>
                    <div class="swiper-pagination"></div>
                </div>
            </div>
        </div>
        <div class="col-lg-6">
            <div class="product-thumb-with-content row">
                <div class="col-12 order-lg-1 order-2 pt-10 pt-lg-0">
                    <div class="single-product-content">
                        <h2 class="title">手机新闻</h2>
                        <p class="short-desc mb-6" id="detail">此商品的详情介绍</p>
                    </div>
                </div>
                <div class="col-12 order-lg-2 order-1 pt-10 pt-lg-0">
                    <div class="swiper-container single-product-thumbs">
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="product-tab-area" style="padding-bottom: 50px;margin-top: 40px;">
    <div class="container" id="content">
<!--        <div style="margin-top: 40px;">-->
<!--            <caption><h5>占芭假日</h5></caption>-->
<!--            <table class="pwde-table">-->
<!--                <thead>-->
<!--                    <tr class="pwde-tr" style="color: white;">-->
<!--                        <th width="25%">注册</th>-->
<!--                        <th>如何取消</th>-->
<!--                        <th width="25%">费用</th>-->
<!--                        <th width="25%">常见问题</th>-->
<!--                    </tr>-->
<!--                </thead>-->
<!--                <tbody id="test1">-->
<!--                    <tr>-->
<!--                        <td>111</td>-->
<!--                        <td>222</td>-->
<!--                        <td>333</td>-->
<!--                        <td>444</td>-->
<!--                    </tr>-->
<!--                </tbody>-->
<!--            </table>-->
<!--        </div>-->
    </div>
</div>

<script src="js/vendor.min.js"></script>
<script src="js/plugins.min.js"></script>
<script src="js/main.min.js"></script>
<script src="layui/layui.js"></script>
<script src="js/token.js"></script>
<script src="js/config.js"></script>
<script src="js/jquery.i18n.min.js"></script>
<script src="js/multi_lang_config.js"></script>
<script>

    var layer = layui.layer;
    var form = layui.form;

    var moduleName = "subMain";
    var defaultLang = layui.data('langTab').langType;
    initLangConfig({
        defaultLang:defaultLang,
        filePath: "js/i18n/"+moduleName+"/",
        module:moduleName,
        base:"js/"
    })
    var i18np = null;
    function changeLang(lang) {
        defaultLang = lang;
        reloadI18n({
            defaultLang:lang,
            filePath: "js/i18n/"+moduleName+"/",
            module:moduleName,
        })
        i18np.loadProperties(moduleName);
        sjxwDataInit();
    }

    layui.config({base: 'js/'})
        // 继承treetable.js插件
        .extend({i18np: 'i18n'}).use([ 'i18np','jquery'], function () {
        i18np = layui.i18np;
        i18np.loadProperties(moduleName);
    });

    var sjxwData = {};
    var news = [];
    function sjxwDataInit(){
        var s = "";
        if (defaultLang == "zh") {
            $('#detail').html(sjxwData.detailZh);
            for (var i=0;i<news.length;i++){
                s = s + "<div style=\"margin-top: 40px;\">\n" +
                    "            <caption><h5>"+news[i].journalismNameZh+"</h5></caption>\n" +
                    "            <table class=\"pwde-table\">\n" +
                    "                <thead>\n" +
                    "                    <tr class=\"pwde-tr\" style=\"color: white;\">\n" +
                    "                        <th width=\"25%\">注册</th>\n" +
                    "                        <th>如何取消</th>\n" +
                    "                        <th width=\"25%\">费用</th>\n" +
                    "                        <th width=\"25%\">常见问题</th>\n" +
                    "                    </tr>\n" +
                    "                </thead>\n" +
                    "                <tbody id=\"test\">\n" +
                    "                    <tr>\n" +
                    "                        <td>"+news[i].openZh+"</td>\n" +
                    "                        <td>"+news[i].cancelZh+"</td>\n" +
                    "                        <td>"+news[i].costZh+"</td>\n" +
                    "                        <td>"+news[i].faqsZh+"</td>\n" +
                    "                    </tr>\n" +
                    "                </tbody>\n" +
                    "            </table>\n" +
                    "        </div>";
            }
        } else if (defaultLang == "la") {
            $('#detail').html(sjxwData.detailLao);
            for (var i=0;i<news.length;i++){
                s = s + "<div style=\"margin-top: 40px;\">\n" +
                    "            <caption><h5>"+news[i].journalismNameLao+"</h5></caption>\n" +
                    "            <table class=\"pwde-table\">\n" +
                    "                <thead>\n" +
                    "                    <tr class=\"pwde-tr\" style=\"color: white;\">\n" +
                    "                        <th width=\"25%\">注册</th>\n" +
                    "                        <th>如何取消</th>\n" +
                    "                        <th width=\"25%\">费用</th>\n" +
                    "                        <th width=\"25%\">常见问题</th>\n" +
                    "                    </tr>\n" +
                    "                </thead>\n" +
                    "                <tbody id=\"test\">\n" +
                    "                    <tr>\n" +
                    "                        <td>"+news[i].openLao+"</td>\n" +
                    "                        <td>"+news[i].cancelLao+"</td>\n" +
                    "                        <td>"+news[i].costLao+"</td>\n" +
                    "                        <td>"+news[i].faqsLao+"</td>\n" +
                    "                    </tr>\n" +
                    "                </tbody>\n" +
                    "            </table>\n" +
                    "        </div>";
            }
        } else if (defaultLang == "en") {
            $('#detail').html(sjxwData.detailEn);
            for (var i=0;i<news.length;i++){
                s = s + "<div style=\"margin-top: 40px;\">\n" +
                    "            <caption><h5>"+news[i].journalismNameEn+"</h5></caption>\n" +
                    "            <table class=\"pwde-table\">\n" +
                    "                <thead>\n" +
                    "                    <tr class=\"pwde-tr\" style=\"color: white;\">\n" +
                    "                        <th width=\"25%\">注册</th>\n" +
                    "                        <th>如何取消</th>\n" +
                    "                        <th width=\"25%\">费用</th>\n" +
                    "                        <th width=\"25%\">常见问题</th>\n" +
                    "                    </tr>\n" +
                    "                </thead>\n" +
                    "                <tbody id=\"test\">\n" +
                    "                    <tr>\n" +
                    "                        <td>"+news[i].openEn+"</td>\n" +
                    "                        <td>"+news[i].cancelEn+"</td>\n" +
                    "                        <td>"+news[i].costEn+"</td>\n" +
                    "                        <td>"+news[i].faqsEn+"</td>\n" +
                    "                    </tr>\n" +
                    "                </tbody>\n" +
                    "            </table>\n" +
                    "        </div>";
            }
        }
        $("#content").html(s);
    }

    $(function (){
        search();
    })
    function search() {
        $.ajax({
            url: HOST+"webapi/addValueService/getAddValueServerByType?type=6",
            type: "GET",
            success: function (res) {
                $("#pic-bac2").attr("src",res.data.picture);
                sjxwData = res.data;
            }
        })
        $.ajax({
            url: HOST+"webapi/news/getMobileNewsList",
            type: "GET",
            success: function (res) {
                if (res.code == 200){
                    news = res.data;
                    sjxwDataInit();
                }
            }
        })
    }

</script>
</body>
</html>